<template>
	<view class="basket-outer-wrapper">
		<view class="prod-list">
			<view v-for="(shopCart, topIndex) in shopCartOrders" :key="topIndex" class="shop-item">
				<!-- 头部店铺 -->
				<view class="head-shop">
					<view class="btn choose-btn">
						<label>
							<checkbox @tap="onSelectedShopItem" :data-topindex="topIndex" :checked="shopCart.checked"
								color="#E43130"></checkbox>
						</label>
					</view>
					<view class="shop-box">
						<view class="shop-icon">
							<image src="/static/images/icon/shop.png"></image>
						</view>
						<view class="shop-name">{{shopCart.shopName}}</view>
					</view>
				</view>
				<!-- /头部店铺 -->

				<view v-for="(item, scIndex) in shopCart.shopCartItemDiscounts" :key="scIndex">
					<view :class="'prod-block ' + (item.chooseDiscountItemDto?'discount':'')">
						<!-- 满减提示 -->
						<view class="discount-tips" v-if="item.chooseDiscountItemDto">
							<text
								class="text-block">{{wxs.parseDiscount(item.chooseDiscountItemDto.discountRule,curLang)}}</text>
							<text
								class="text-list">{{wxs.parseDiscountMsg(item.chooseDiscountItemDto.discountRule,item.chooseDiscountItemDto.needAmount,item.chooseDiscountItemDto.discount,curLang)}}</text>
							<text class="text-list reduce-amount"
								v-if="item.chooseDiscountItemDto.reduceAmount >0">{{i18n.haveDiscount}}￥{{wxs.parsePrice(item.chooseDiscountItemDto.reduceAmount)[0]}}.{{wxs.parsePrice(item.chooseDiscountItemDto.reduceAmount)[1]}}</text>
						</view>

						<!-- 商品item -->
						<view v-for="(prod, index) in item.shopCartItems" :key="index">
							<view class="goods-item">
								<!-- 商品信息 -->
								<view class="item">
									<view class="btn">
										<label>
											<checkbox @tap="onSelectedItem" :data-topindex="topIndex"
												:data-scindex="scIndex" :data-index="index"
												:value="toString(prod.prodId)" :checked="prod.checked" color="#E43130">
											</checkbox>
										</label>
									</view>
									<view class="prodinfo">
										<view class="pic" @tap="toProdPage" :data-prodid="prod.prodId">
											<image :src="prod.pic"></image>
										</view>
										<view class="opt">
											<view class="prod-name">{{prod.prodName}}</view>
											<view class="prod-center-row">
												<view :class="'prod-info-text ' + (prod.skuName?'':'empty-n')">
													{{prod.skuName}}
												</view>
												<view class="prod-discount" v-if="prod.discounts.length>0">
													<text class="prod-discount-tit"
														@tap="onChooseDiscount(prod.basketId,prod.discountId,prod.discounts,prod.checked)">{{wxs.getCurrDiscountName(prod.discountId,prod.discounts,curLang)}}</text>
												</view>
											</view>
											<view class="price-count">
												<view class="price">
													<text class="symbol">￥</text>
													<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
													<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text>
												</view>
												<view class="m-numSelector">
													<view @tap="onCountMinus" class="minus" :data-topindex="topIndex"
														:data-scindex="scIndex" :data-index="index"></view>
													<input type="number" :value="prod.prodCount" disabled></input>
													<view @tap="onCountPlus" class="plus" :data-topindex="topIndex"
														:data-scindex="scIndex" :data-index="index"></view>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 底部按钮 -->
		<!-- 英文时候购物车底部字体出现遮蔽 -->
		<view class="cart-footer" v-if="shopCartOrders.length>0"
			:style="i18n.instantReduction.length>2?'height:130rpx':''">
			<view class="btn all">
				<label @tap="onSelAll">
					<checkbox :checked="allChecked" color="#E43130"></checkbox>{{i18n.selectAll}}
				</label>
			</view>
			<view class="btn del" @tap="onDelBasket">
				<text>{{i18n.delete}}</text>
			</view>
			<view class="btn total">
				<view class="total-con" @tap.stop="showPriDet">
					<view class="finally">
						<text class="blod">{{i18n.total}}:</text>
						<view class="price">
							<text class="symbol">￥</text>
							<text class="big-num">{{wxs.parsePrice(finalMoney)[0]}}</text>
							<text class="small-num">.{{wxs.parsePrice(finalMoney)[1]}}</text>
						</view>
					</view>
					<view class="total-msg" v-if="subtractMoney>0">
						{{i18n.instantReduction}}:￥{{wxs.toPrice(subtractMoney)}}
					</view>
					<!-- 总额:￥{{wxs.toPrice(totalMoney)}}  -->
				</view>
				<view class="arrow-icon" @tap.stop="showPriDet">
					<image src="/static/images/icon/down-arrow.png" v-if="hidePriModal"></image>
					<image src="/static/images/icon/up-arrow.png" v-if="!hidePriModal"></image>
				</view>
			</view>
			<view class="btn settle" @tap="toFirmOrder">
				<text>{{i18n.settlement}}</text>
			</view>
		</view>
		<!-- end 底部按钮 -->

		<!-- 底部活动选择弹框 -->
		<view class="modals modals-bottom-dialog" :hidden="hideModal">
			<view class="modals-cancel" @tap="hideModalFun"></view>
			<view class="bottom-dialog-body bottom-pos radius" :animation="animationData">
				<view class="discount-title radius">{{i18n.selectPromotion}}</view>
				<view class="radio-group">
					<radio-group @change="radioChange" v-if="reDraw">
						<label v-for="(item, index) in prodDiscounts" :key="index">
							<view class="radio-item">
								<radio color="#e43130" :value="String(item.discountId)"
									:checked="item.discountId==discountId"></radio>
								<view class="radio-text">
									{{item.discountName}}
								</view>
							</view>
						</label>
						<label>
							<view class="radio-item">
								<radio color="#e43130" value="-1" :checked="discountId==-1"></radio>
								<view class="radio-text">
									{{i18n.notPromotion}}
								</view>
							</view>
						</label>
					</radio-group>
				</view>
			</view>
		</view>

		<!-- 底部金额明细弹框 -->
		<view class="pri-modal modals-bottom-dialog" :hidden="hidePriModal">
			<view class="modals-cancel" @tap="hidePriModalFun"></view>
			<view class="bottom-dialog-box bottom-pos radius" :animation="animationData">
				<view class="discount-title radius">{{i18n.amountDetails}}</view>
				<view class="price-detail">
					<view class="price-detail-item">
						<view class="det-tit">{{i18n.comTotal}}</view>
						<view class="det-num">￥{{wxs.toPrice(totalMoney)}}</view>
					</view>
					<view class="price-detail-item" v-if="subtractMoney > 0">
						<view class="det-tit">{{i18n.promotionalDiscount}}</view>
						<view class="det-num">-￥{{wxs.toPrice(subtractMoney)}}</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 空 -->
		<view class="empty" v-if="!shopCartOrders.length">
			<view class="empty-icon">
				<image :src="pictureDomain+'empty-car.png'"></image>
			</view>
			<view class="empty-text">{{i18n.shoppingTips}}</view>
		</view>

		<!-- 商品配送方式选择 -->
		<view class="select-distribution modals-bottom-dialog" v-if="showDeliveryWay">
			<view class="modals-cancel" @tap="hideDeliveryFun"></view>
			<view class="bottom-dialog-box bottom-pos radius" :animation="animationData">
				<view class="discount-title radius">{{i18n.chooseCom}}</view>
				<view class="distribution-prods">
					<view class="des">{{i18n.deliveryTips}}</view>
					<view class="p-item" v-if="hasShopDeliveryList.length > 0">
						<view class="p-tit">{{i18n.expressDelivery}}</view>
						<view class="p-con">
							<view class="prods-item">
								<view class="pic" v-for="(item,index) in hasShopDeliveryList" :key="index">
									<image :src="item.pic"></image>
									<view class="prod-count">x{{item.prodCount}}</view>
								</view>
							</view>
							<view class="p-btn" @tap="toSubmitOrder(1)">{{i18n.toSettle}}</view>
						</view>
						<view class="p-total">{{i18n.inTotal}}
							<!-- <view class="num">{{hasShopDeliveryList.length}}</view>{{i18n.piece}}，{{i18n.total}}：<view class="price">￥{{totalSdPri}}</view> -->
							<view class="num">{{hasShopDeliveryProdCount}}</view>
							{{i18n.items}}
						</view>
					</view>
					<view class="p-item" v-if="hasCityDeliveryList.length > 0">
						<view class="p-tit">{{i18n.sameDelivery}}</view>
						<view class="p-con">
							<view class="prods-item">
								<view class="pic" v-for="(item,index) in hasCityDeliveryList" :key="index">
									<image :src="item.pic"></image>
									<view class="prod-count">x{{item.prodCount}}</view>
								</view>
							</view>
							<view class="p-btn" @tap="toSubmitOrder(4)">{{i18n.toSettle}}</view>
						</view>
						<view class="p-total">{{i18n.inTotal}}
							<!-- <view class="num">{{hasCityDeliveryList.length}}</view>{<view class="num">{{hasCityDeliveryList.length}}</view>{{i18n.piece}}，{{i18n.total}}：<view class="price">￥{{totalCdPri}}</view> -->
							<view class="num">{{hasCityDeliveryProdCount}}</view>{{i18n.items}}
						</view>
					</view>
					<view class="p-item" v-if="hasUserPickUpList.length > 0">
						<view class="p-tit">{{i18n.pickStore}}</view>
						<view class="p-con">
							<view class="prods-item">
								<view class="pic" v-for="(item,index) in hasUserPickUpList" :key="index">
									<image :src="item.pic"></image>
									<view class="prod-count">x{{item.prodCount}}</view>
								</view>
							</view>
							<view class="p-btn" @tap="toSubmitOrder(2)">{{i18n.toSettle}}</view>
						</view>
						<view class="p-total">{{i18n.inTotal}}
							<!-- <view class="num">{{hasUserPickUpList.length}}</view>{{i18n.piece}}，{{i18n.total}}：<view class="price">￥{{totalPuPri}}</view> -->
							<view class="num">{{hasUserPickUpProdCount}}</view>{{i18n.items}}
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>

<script>
	// pages/basket/basket.js
	var config = require("../../utils/config.js");
	var http = require("../../utils/http.js");
	const Big = require("../../utils/big.min.js");
	import {
		AppType
	} from "../../utils/constant.js"
	import util from "../../utils/util.js";


	export default {
		data() {
			return {
				pictureDomain: config.pictureDomain,
				//所有店铺的数据
				shopCartOrders: [],
				shopCartItemDiscounts: [],
				finalMoney: 0,
				totalMoney: 0,
				subtractMoney: 0,
				allChecked: false,
				hideModal: true, //模态框的状态  true-隐藏  false-显示
				hidePriModal: true, //金额明细模态框的状态  true-隐藏  false-显示
				animationData: {},
				prodDiscounts: [],
				discountId: 0, //促销活动id
				basketId: 0,
				currentDiscounts: [], //促销活动列表
				reDraw: true,

				showDeliveryWay: false, // 选择配送方式弹窗
				hasCityDeliveryList: [], // 同城配送
				hasShopDeliveryList: [], // 店铺配送
				hasUserPickUpList: [], // 用户自提
				totalCdPri: 0, // 同城配送总额
				totalSdPri: 0, // 店铺配送总额
				totalPuPri: 0, // 用户自提总额
				hasShopDeliveryProdCount: 0, // 店铺配送商品总数
				hasCityDeliveryProdCount: 0, // 同城配送商品总数
				hasUserPickUpProdCount: 0, // 用户自提商品总数
				dvyType: 1, // 配送类型 1:快递 2:自提 3：无需快递 4:同城配送
				requestingNum: 0,

				basketReqData: [], // 请求购物车的数据
				curBasketItemCheck: false, // 切换满减活动时商品是否勾选
				// shopSelectArr: [], // 选中的店铺
				curLang: uni.getStorageSync('lang')
			};
		},

		computed: {
			i18n() {
				return this.$t('index')
			}
		},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			uni.setNavigationBarTitle({
				title: this.i18n.shoppingCart2
			});
			// #ifndef H5
			var logData = uni.getStorageSync('flowAnalysisLogDto')
			uni.setStorageSync('step', uni.getStorageSync('step') / 1 + 1)
			if (logData && logData.pageId != 8) {
				logData.pageId = 8
				logData.step = uni.getStorageSync('step')
				uni.setStorageSync('flowAnalysisLogDto', logData)
				http.saveLog(logData, 1)
			}
			// #endif
			this.showDeliveryWay = false
			if (!uni.getStorageSync('token')) {
				this.shopCartOrders = []
				util.removeTabBadge()
			}
			//加载购物车
			this.loadBasketData(null);
		},
		onHide: function() {
			this.hidePriModal = true
			this.hideModal = true
		},
		methods: {
			/**
			 * 加载购物车方法
			 * @param {Object} discountData 选择的满减活动
			 */
			loadBasketData(discountData) {
				var reqData = [];
				var shopCartIds = [];
				if (discountData) {
					reqData.push(discountData)
				}
				this.shopCartOrders.forEach(shopCart => {
					shopCart.shopCartItemDiscounts.forEach(cItems => {
						cItems.shopCartItems.forEach(pItem => {
							if (pItem.checked) {
								shopCartIds.push(pItem.basketId);
							}
						})
					})
				})
				reqData = [...this.basketReqData, ...reqData]
				uni.showLoading(); //加载购物车
				var params = {
					url: "/p/shopCart/info",
					method: "POST",
					data: reqData,
					callBack: res => {
						if (res.length > 0) {
							var shopCartOrders = res;
							if (shopCartIds.length == 0) {
								this.setData({
									shopCartOrders: shopCartOrders,
								});
							} else { // 修改购物车
								var checkedLog = []
								this.shopCartOrders.forEach(shopCart => {
									shopCart.shopCartItemDiscounts.forEach(shopCartItemDiscount => {
										shopCartItemDiscount.shopCartItems.forEach(
											shopCartItem => {
												if (shopCartItem.checked) {
													checkedLog.push(shopCartItem.basketId)
												}
											})
									})
								})
								shopCartOrders.forEach(newShopCart => {
									newShopCart.shopCartItemDiscounts.forEach(newShopCartItemDiscount => {
										newShopCartItemDiscount.shopCartItems.forEach(
											shopCartItem => {
												if (checkedLog.includes(shopCartItem
														.basketId)) {
													shopCartItem.checked = true
												}
											})
									})
								})
								this.shopCartOrders = shopCartOrders
							}
						} else {
							this.setData({
								shopCartOrders: []
							});
						}
						this.calTotalPrice(); //计算总价
						this.checkAllSelected()
					}
				};
				http.request(params);
				http.getCartCount(); //重新计算购物车总数量
			},

			/**
			 * 结算(结算按钮)
			 */
			toFirmOrder: function() {
				if (this.basketReqData.length > 50) {
					uni.showModal({
						title: this.i18n.tips,
						content: this.i18n.basketSelectedCount + this.basketReqData.length + this.i18n
							.basketCountOver,
						confirmText: this.i18n.confirm,
						showCancel: false,
						success: res => {},
						fail: () => {},
						complete: () => {}
					});
					return
				}
				var shopCartOrders = this.shopCartOrders;
				var basketIds = [];
				var selectShopId = []
				var hasCityDeliveryList = [] // 同城配送
				var hasShopDeliveryList = [] // 店铺配送
				var hasUserPickUpList = [] // 用户自提

				var hasShopDeliveryProdCount = 0 // 店铺配送商品总数
				var hasCityDeliveryProdCount = 0 // 同城配送商品总数
				var hasUserPickUpProdCount = 0 // 用户自提商品总数
				var totalCdPri = 0
				var totalSdPri = 0
				var totalPuPri = 0

				shopCartOrders.forEach(shopCart => {
					var shopCartItemDiscounts = shopCart.shopCartItemDiscounts;
					shopCartItemDiscounts.forEach(shopCartItemDiscount => {
						shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
							if (shopCartItem.checked) {
								basketIds.push(shopCartItem.basketId);
								selectShopId.push(shopCart.shopId)
								// 将商品item放入对应数组中
								if (shopCartItem.deliveryModeVO.hasCityDelivery) {
									hasCityDeliveryList.push(shopCartItem) // 同城配送
									var x = new Big(totalCdPri)
									var y = new Big(shopCartItem.price)
									totalCdPri = x.plus(y).valueOf()
									hasCityDeliveryProdCount += shopCartItem.prodCount
									// totalCdPri += shopCartItem.price
								}
								if (shopCartItem.deliveryModeVO.hasShopDelivery) {
									hasShopDeliveryList.push(shopCartItem) // 店铺配送
									var x = new Big(totalSdPri)
									var y = new Big(shopCartItem.price)
									totalSdPri = x.plus(y).valueOf()
									hasShopDeliveryProdCount += shopCartItem.prodCount
									// totalSdPri += shopCartItem.price
								}
								if (shopCartItem.deliveryModeVO.hasUserPickUp) {
									hasUserPickUpList.push(shopCartItem) // 用户自提
									var x = new Big(totalPuPri)
									var y = new Big(shopCartItem.price)
									totalPuPri = x.plus(y).valueOf()
									hasUserPickUpProdCount += shopCartItem.prodCount
									// totalPuPri += shopCartItem.price
								}
							}
						});
					});
				});
				var shopSelectArr = [...new Set(selectShopId)] // 选中的商品所在店铺去重
				this.totalCdPri = totalCdPri
				this.totalSdPri = totalSdPri
				this.totalPuPri = totalPuPri
				this.hasCityDeliveryProdCount = hasCityDeliveryProdCount
				this.hasShopDeliveryProdCount = hasShopDeliveryProdCount
				this.hasUserPickUpProdCount = hasUserPickUpProdCount
				this.hasShopDeliveryList = hasShopDeliveryList
				this.hasCityDeliveryList = hasCityDeliveryList
				this.hasUserPickUpList = hasUserPickUpList

				if (!basketIds.length) {
					uni.showToast({
						title: this.i18n.selectProduct,
						icon: "none"
					});
					return;
				}

				wx.setStorageSync("basketIds", JSON.stringify(basketIds));
				// 判断：多个店铺直接结算（配送方式默认快递），单个店铺根据商品判断可选择的配送方式
				if ((basketIds.length == 1 && shopSelectArr.length == 1) || shopSelectArr.length > 1) {
					// 店铺列表大于1（多店铺），直接结算
					uni.navigateTo({
						url: '/packageProduct/pages/submit-order/submit-order?orderEntry=0' +
							'&dvyType=1' //dvyType 配送类型 1:快递 2:自提 3：无需快递 4:同城配送
					});
				} else if (basketIds.length > 1 && shopSelectArr.length == 1) {
					//单个店铺
					var animation = wx.createAnimation({
						duration: 600,
						timingFunction: 'ease'
					});
					this.animation = animation;
					this.showDeliveryWay = true // 底部选择配送方式弹窗
					setTimeout(() => {
						this.fadeIn();
					}, 200);
				}
			},

			/**
			 * 单个店铺去结算
			 */
			toSubmitOrder: function(dvyType) {
				util.tapLog()
				let basketIds = []
				if (dvyType == 1) { // 快递
					this.hasShopDeliveryList.forEach((el) => {
						basketIds.push(el.basketId)
					})
				} else if (dvyType == 4) { // 同城
					this.hasCityDeliveryList.forEach((el) => {
						basketIds.push(el.basketId)
					})
				} else if (dvyType == 2) { // 自提
					this.hasUserPickUpList.forEach((el) => {
						basketIds.push(el.basketId)
					})
				}
				wx.setStorageSync("basketIds", JSON.stringify(basketIds));
				uni.navigateTo({
					url: '/packageProduct/pages/submit-order/submit-order?orderEntry=0' + '&dvyType=' + dvyType
				});
			},


			// 关闭配送方式选择弹窗
			hideDeliveryFun() {
				util.tapLog()
				var that = this;
				var animation = wx.createAnimation({
					duration: 800,
					timingFunction: 'ease',
				})
				this.animation = animation
				that.fadeDown();
				setTimeout(function() {
					that.setData({
						showDeliveryWay: false
					})
				}, 680)
			},


			/**
			 * 全选
			 */
			onSelAll: function() {
				util.tapLog()
				var allChecked = this.allChecked;
				allChecked = !allChecked; //改变状态

				var shopCartOrders = this.shopCartOrders;
				shopCartOrders.forEach(shopCart => {
					shopCart.checked = allChecked;
					var shopCartItemDiscounts = shopCart.shopCartItemDiscounts;
					for (var i = 0; i < shopCartItemDiscounts.length; i++) {
						var cItems = shopCartItemDiscounts[i].shopCartItems;
						for (var j = 0; j < cItems.length; j++) {
							cItems[j].checked = allChecked;
							if (allChecked) {
								this.basketReqData.push({
									basketId: cItems[j].basketId,
									discountId: '',
									isCheck: allChecked
								})
							} else {
								this.basketReqData = []
							}
						}
					}
				});
				this.setData({
					allChecked: allChecked,
					shopCartOrders: shopCartOrders
				});
				this.loadBasketData()
			},

			/**
			 * 每一项的选择事件
			 */
			onSelectedItem: function(e) {
				util.tapLog()
				var index = e.currentTarget.dataset.index; // 获取data- 传进来的index
				var scindex = e.currentTarget.dataset.scindex;
				var topindex = e.currentTarget.dataset.topindex;
				var shopCartOrders = this.shopCartOrders;
				var shopCartItemDiscounts = shopCartOrders[topindex].shopCartItemDiscounts; // 获取购物车列表
				var checked = shopCartItemDiscounts[scindex].shopCartItems[index].checked; // 获取当前商品的选中状态
				shopCartItemDiscounts[scindex].shopCartItems[index].checked = !checked; // 改变状态
				this.setData({
					shopCartOrders: shopCartOrders
				});
				if (shopCartItemDiscounts[scindex].shopCartItems[index].checked) {
					this.basketReqData.push({
						basketId: shopCartItemDiscounts[scindex].shopCartItems[index].basketId,
						discountId: '',
						isCheck: true
					})
				} else {
					var sliceIndex = null
					this.basketReqData.forEach((el, index) => {
						if (!el.checked) {
							sliceIndex = index
						}
					})
					this.basketReqData.splice(sliceIndex, 1)
				}
				this.loadBasketData()
			},

			/**
			 * 每一个店铺的选择
			 */
			onSelectedShopItem: function(e) {
				util.tapLog()
				var topindex = e.currentTarget.dataset.topindex;
				var shopCartOrders = this.shopCartOrders;
				var checked = shopCartOrders[topindex].checked; // 获取当前商品的选中状
				shopCartOrders[topindex].checked = !checked; // 改变状态
				shopCartOrders[topindex].shopCartItemDiscounts.forEach(shopCartItem => {
					var cItems = shopCartItem.shopCartItems;
					for (var j = 0; j < cItems.length; j++) {
						cItems[j].checked = !checked;
					}
				});
				this.setData({
					shopCartOrders: shopCartOrders
				});
				this.checkAllSelected(); //检查全选状态
				this.calTotalPrice(); //计算总价
			},

			/**
			 * 检查全选状态
			 */
			checkAllSelected: function() {
				var allChecked = true;
				var shopCartOrders = this.shopCartOrders;
				var flag = false;
				shopCartOrders.forEach(shopCart => {
					var shopChecked = true;
					var shopCartItemDiscounts = shopCart.shopCartItemDiscounts;
					for (var i = 0; i < shopCartItemDiscounts.length; i++) {
						var cItems = shopCartItemDiscounts[i].shopCartItems;
						for (var j = 0; j < cItems.length; j++) {
							if (!cItems[j].checked) {
								shopChecked = false;
								allChecked = false;
								flag = true;
							}
							cItems[j].checked = !!cItems[j].checked
						}
					}

					shopCart.checked = shopChecked;
				});
				this.setData({
					allChecked: allChecked,
					shopCartOrders: shopCartOrders
				});
			},

			/**
			 * 计算购物车总额
			 */
			calTotalPrice: function() {
				var shopCartOrders = this.shopCartOrders;
				var shopCartIds = [];
				shopCartOrders.forEach(shopCart => {
					var shopCartItemDiscounts = shopCart.shopCartItemDiscounts;
					for (var i = 0; i < shopCartItemDiscounts.length; i++) {
						var cItems = shopCartItemDiscounts[i].shopCartItems;
						for (var j = 0; j < cItems.length; j++) {
							if (cItems[j].checked) {
								shopCartIds.push(cItems[j].basketId);
							}
						}
					}
				});
				var ths = this;

				var params = {
					url: "/p/shopCart/totalPay",
					method: "POST",
					data: shopCartIds,
					callBack: function(res) {
						ths.setData({
							finalMoney: res.finalMoney,
							totalMoney: res.totalMoney,
							subtractMoney: res.subtractMoney
						});
						uni.hideLoading()
					}
				};
				http.request(params);
			},

			/**
			 * 减少数量
			 */
			onCountMinus: function(e) {
				var index = e.currentTarget.dataset.index;
				var scindex = e.currentTarget.dataset.scindex;
				var topindex = e.currentTarget.dataset.topindex;
				var shopCartOrders = this.shopCartOrders;
				var shopCartItemDiscounts = shopCartOrders[topindex].shopCartItemDiscounts;
				var prodCount = shopCartItemDiscounts[scindex].shopCartItems[index].prodCount;

				if (prodCount > 1) {
					this.updateCount(shopCartOrders, topindex, scindex, index, -1);
				}
			},

			/**
			 * 增加数量
			 */
			onCountPlus: function(e) {
				var index = e.currentTarget.dataset.index;
				var scindex = e.currentTarget.dataset.scindex;
				var topindex = e.currentTarget.dataset.topindex;
				var shopCartOrders = this.shopCartOrders;
				this.updateCount(shopCartOrders, topindex, scindex, index, 1);
			},

			/**
			 * 改变购物车数量接口
			 */
			updateCount: function(shopCartOrders, topindex, scindex, index, prodCount) {
				var shopCartItemDiscounts = shopCartOrders[topindex].shopCartItemDiscounts;
				var ths = this;
				uni.showLoading({
					mask: true
				});
				var params = {
					url: "/p/shopCart/changeItem",
					method: "POST",
					data: {
						count: prodCount,
						prodId: shopCartItemDiscounts[scindex].shopCartItems[index].prodId,
						skuId: shopCartItemDiscounts[scindex].shopCartItems[index].skuId,
						shopId: shopCartItemDiscounts[scindex].shopCartItems[index].shopId
					},
					callBack: function(res) {
						shopCartItemDiscounts[scindex].shopCartItems[index].prodCount += prodCount;
						ths.setData({
							shopCartOrders: shopCartOrders
						});
						var discountData = {
							basketId: shopCartItemDiscounts[scindex].shopCartItems[index].basketId,
							discountId: shopCartItemDiscounts[scindex].shopCartItems[index].discountId
						}
						ths.loadBasketData(discountData)
						uni.hideLoading()
					}
				};
				http.request(params);
				if (prodCount >= 1) {
					const flowAnalysisLogDto = uni.getStorageSync('flowAnalysisLogDto')
					flowAnalysisLogDto.bizData = shopCartItemDiscounts[scindex].shopCartItems[index].prodId
					flowAnalysisLogDto.bizType = 0
					uni.setStorageSync('flowAnalysisLogDto', flowAnalysisLogDto)
					util.tapLog(4, '', '', prodCount)
				}
			},

			/**
			 * 删除购物车商品
			 */
			onDelBasket: function() {
				util.tapLog()
				var ths = this;
				var shopCartOrders = this.shopCartOrders;
				var basketIds = [];
				shopCartOrders.forEach(shopCart => {
					var shopCartItemDiscounts = shopCart.shopCartItemDiscounts;
					for (var i = 0; i < shopCartItemDiscounts.length; i++) {
						var cItems = shopCartItemDiscounts[i].shopCartItems;
						for (var j = 0; j < cItems.length; j++) {
							if (cItems[j].checked) {
								basketIds.push(cItems[j].basketId);
							}
						}
					}
				});
				if (basketIds.length == 0) {
					var ths = this
					uni.showToast({
						title: ths.i18n.selectProduct,
						icon: "none"
					});
				} else {
					this.showPriDet()
					this.hideModalFun()
					this.hidePriModal = true
					uni.showModal({
						title: '',
						content: ths.i18n.deleteProductTips,
						cancelText: ths.i18n.cancel,
						confirmText: ths.i18n.confirm,
						confirmColor: "#eb2444",

						success(res) {
							if (res.confirm) {
								uni.showLoading({
									mask: true
								});
								var params = {
									url: "/p/shopCart/deleteItem",
									method: "DELETE",
									data: basketIds,
									callBack: res2 => {
										uni.hideLoading()
										ths.loadBasketData();
									}
								};
								http.request(params);
							}
						}
					});
				}
			},

			/**
			 * 点击满减活动 弹窗
			 */
			onChooseDiscount(basketId, discountId, discounts, checked) {
				util.tapLog()
				this.reDraw = false
				this.setData({
					prodDiscounts: discounts,
					hideModal: false,
					discountId: discountId,
					basketId: basketId,
					curBasketItemCheck: Boolean(checked), // 当前展示满减活动的商品是否已选中
				});
				var animation = wx.createAnimation({
					duration: 600,
					timingFunction: 'ease'
				});
				this.animation = animation;
				this.reDraw = true
				setTimeout(() => {
					this.fadeIn();
				}, 200);
			},
			radioChange(e) {
				util.tapLog()
				this.loadBasketData({
					basketId: this.basketId,
					discountId: e.detail.value,
					isCheck: this.curBasketItemCheck
				});
				this.fadeDown()
				setTimeout(() => {
					this.setData({
						hideModal: true
					});
				}, 500)
				this.reDraw = false
			},

			// 隐藏遮罩层
			hideModalFun: function() {
				util.tapLog()
				this.reDraw = false
				var that = this;
				var animation = wx.createAnimation({
					duration: 800,
					timingFunction: 'ease'
				});
				this.animation = animation;
				that.fadeDown();
				setTimeout(function() {
					that.setData({
						hideModal: true
					});
				}, 720);
			},
			//动画集
			fadeIn: function() {
				this.animation.translateY(0).step();
				this.setData({
					animationData: this.animation.export() //动画实例的export方法导出动画数据传递给组件的animation属性

				});
			},
			fadeDown: function() {
				this.animation.translateY(300).step();
				this.setData({
					animationData: this.animation.export()
				});
			},

			/**
			 * 跳转到商品详情
			 */
			toProdPage(e) {
				util.tapLog()
				this.$Router.push({
					path: '/packageProduct/pages/prod/prod',
					query: {
						prodid: e.currentTarget.dataset.prodid
					}
				})
			},


			/**
			 * 金额明细弹窗
			 */
			showPriDet() {
				util.tapLog()
				var that = this;
				if (this.hidePriModal == true) {
					this.hidePriModal = false
					var animation = wx.createAnimation({
						duration: 500,
						timingFunction: 'ease',
					})
					this.animation = animation
					setTimeout(function() {
						that.fadeIn();
					}, 100)
				} else if (this.hidePriModal == false) {
					this.hidePriModalFun()
				}
			},

			hidePriModalFun() {
				util.tapLog()
				var that = this;
				var animation = wx.createAnimation({
					duration: 800,
					timingFunction: 'ease',
				})
				this.animation = animation
				that.fadeDown();
				setTimeout(function() {
					that.setData({
						hidePriModal: true
					})
				}, 680)
			},

		}
	};
</script>
<style lang="scss">
	.basket-outer-wrapper {
		padding-bottom: 112rpx;
		overflow: auto;


		.prod-list {
			.shop-item {
				margin-top: 20rpx;
				background: #fff;

				.head-shop {
					padding: 20rpx;
					background: #fff;
					display: flex;
					align-items: center;

					image {
						width: 100%;
						height: 100%;
						display: block;
					}

					.choose-btn {
						display: inline-block;
					}

					.shop-box {
						flex: 1;
						display: flex;
						align-items: center;
						margin-left: 8rpx;

						.shop-icon {
							width: 32rpx;
							height: 32rpx;
							margin-right: 10rpx;
						}

						.shop-name {
							font-size: 28rpx;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
							overflow: hidden;
							text-overflow: ellipsis;
							word-break: break-word;
						}
					}
				}

				.prod-block {
					.discount-tips {
						border-top: 2rpx solid #eee;
						padding: 20rpx 16rpx;
						height: 40rpx;
						line-height: 40rpx;

						.text-block {
							padding: 4rpx 6rpx;
							border-radius: 4rpx;
							font-size: 20rpx;
							background: #e43130;
							color: #fff;
							position: relative;
						}

						.text-block::before {
							position: absolute;
							left: 14rpx;
							bottom: -16rpx;
							content: "";
							display: block;
							width: 0;
							height: 0;
							border: 8rpx solid transparent;
							border-top: 8rpx solid #e43130;
						}

						.text-list {
							font-size: 24rpx;
							margin-left: 10rpx;
							font-weight: 600;
						}

						.text-list.reduce-amount {
							font-weight: normal;
							color: #e43130;
							padding-left: 20rpx;
						}
					}

					.goods-item {
						position: relative;
					}

					&.discount {
						.goods-item::after {
							position: absolute;
							left: 36rpx;
							top: 0;
							bottom: 0;
							width: 2rpx;
							height: auto;
							content: "";
							border-left: 2rpx dashed #eee;
							z-index: 0;
						}
					}

					.item {
						background: #fff;
						display: flex;
						align-items: center;
						padding: 20rpx;
						border-top: 2rpx solid #f2f2f2;
						z-index: 2;

						.btn {
							z-index: 3;
						}

						.prodinfo {
							position: relative;
							color: #999;
							flex: 1;
							display: flex;
							margin-left: 10rpx;

							.pic {
								text-align: center;
								width: 180rpx;
								height: 180rpx;
								line-height: 180rpx;
								font-size: 0;

								image {
									max-width: 100%;
									max-height: 100%;
									/* border-radius: 8rpx; */
									vertical-align: middle;
								}
							}

							.opt {
								margin-left: 20rpx;
								flex: 1;
								display: flex;
								flex-direction: column;
								justify-content: space-between;

								.prod-name {
									font-size: 28rpx;
									color: #333;
									line-height: 36rpx;
									display: -webkit-box;
									word-break: break-all;
									overflow: hidden;
									text-overflow: ellipsis;
									-webkit-line-clamp: 1;
									-webkit-box-orient: vertical;
									max-height: 72rpx;
								}

								.prod-discount {
									color: #e43130;
									display: block;
									font-size: 24rpx;

									.prod-discount-tit {
										position: relative;
										padding: 10rpx 40rpx 10rpx 10rpx;
										background: #fdf1f2;
										border-radius: 8rpx;
										max-width: 240rpx;
										white-space: nowrap;
										overflow: hidden;
										text-overflow: ellipsis;
										display: inline-block;
										word-break: keep-all;
									}

									.prod-discount-tit::after {
										content: "";
										width: 12rpx;
										height: 12rpx;
										border: solid #e43130;
										border-width: 1rpx 0 0 1rpx;
										transform: translate(-50%, -50%) rotate(225deg);
										position: absolute;
										right: 10rpx;
										top: 22rpx;
									}
								}

								.prod-info-text {
									color: #999;
									display: inline-block;
									-webkit-line-clamp: 1;
									height: 48rpx;
									line-height: 48rpx;
									background: #f9f9f9;
									padding: 0 10rpx 0 10rpx;
									border-radius: 4rpx;
									overflow: hidden;
									font-size: 24rpx;
									position: relative;
									font-family: arial;
								}

								.prod-info-text.empty-n {
									padding: 0;
								}

								.prod-info-text:before {
									border-top: 5px solid #aaa;
								}

								.prod-info-text:after {
									border-top: 5px solid #f9f9f9;
									top: 9px;
								}

								.price-count {
									display: flex;
									align-items: center;
									justify-content: space-between;
								}

								/* 加减框 */

								.m-numSelector {
									display: flex;
									box-sizing: border-box;
									border: 2rpx solid #eee;
									border-radius: 4rpx;
								}

								.m-numSelector .minus,
								.m-numSelector .plus {
									height: 56rpx;
									width: 56rpx;
									box-sizing: border-box;
									position: relative;
								}

								.m-numSelector input {
									width: 56rpx;
									height: 56rpx;
									text-align: center;
									color: #333;
									border-left: 2rpx solid #eee;
									border-right: 2rpx solid #eee;
									font-size: 24rpx;
									font-family: arial;
								}

								.m-numSelector .minus::before,
								.m-numSelector .plus::before,
								.m-numSelector .plus::after {
									position: absolute;
									top: 0;
									left: 0;
									right: 0;
									bottom: 0;
									margin: auto;
									content: ' ';
									width: 22rpx;
									height: 2rpx;
									background-color: #7f7f7f;
								}

								.m-numSelector .plus::after {
									transform: rotate(90deg);
								}

								.m-numSelector:not(.disabled) .minus:not(.disabled):active,
								.m-numSelector:not(.disabled) .plus:not(.disabled):active {
									opacity: 0.6;
								}
							}
						}
					}
				}
			}
		}

		/*  #ifdef  MP-WEIXIN || APP-PLUS */
		.cart-footer {
			bottom: 0px;
		}

		/*  #endif  */
		/*checkbox 选项框大小  */

		checkbox .wx-checkbox-input {
			border-radius: 50%;
			width: 32rpx;
			height: 32rpx;
		}

		/*checkbox选中后样式  */

		checkbox .wx-checkbox-input.wx-checkbox-input-checked {
			background: #e43130;
			border-color: #e43130;
		}

		/*checkbox选中后图标样式  */

		checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
			text-align: center;
			font-size: 20rpx;
			color: #fff;
			background: transparent;
			transform: translate(-50%, -50%) scale(1);
			-webkit-transform: translate(-50%, -50%) scale(1);
		}


		/** 底部按钮 */

		.cart-footer {
			position: fixed;
			bottom: calc(98rpx + env(safe-area-inset-bottom));
			left: 0;
			width: 100%;
			display: flex;
			align-items: center;
			height: 110rpx;
			border-top: 2rpx solid #f4f4f4;
			z-index: 99;
			background: #fff;
			padding: 0 10rpx 0 20rpx;
			box-sizing: border-box;

			.all {
				font-size: 28rpx;

				label {
					display: flex;
					align-items: center;
				}
			}


			.del {
				color: #e43130;
				font-size: 24rpx;
				margin-left: 14rpx;
			}

			.total {
				flex: 1;
				display: flex;
				align-items: center;
				margin-right: 40rpx;
				justify-content: flex-end;

				.total-con {
					.finally {
						text-align: center;

						.blod {
							font-weight: bold;
							font-size: 28rpx;
						}

						.price {
							font-size: 30rpx;
						}
					}


					.total-msg {
						font-size: 22rpx;
						text-align: center;
					}
				}

				.arrow-icon {
					width: 40rpx;
					height: 20rpx;
					margin-left: 10rpx;

					image {
						display: block;
						width: 100%;
						height: 100%;
					}
				}
			}


			.settle {
				height: 70rpx;
				line-height: 70rpx;
				padding: 0 50rpx;
				background: #e43130;
				color: #fff;
				border-radius: 70rpx;
				margin-right: 20rpx;
				font-size: 28rpx;
			}
		}

		/** end 底部按钮 */

		/* 满减活动弹框 */

		/*模态框*/

		.modals {
			position: fixed;
			z-index: 1999;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;

			&.modals-bottom-dialog {
				position: fixed;
				z-index: 98;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
			}
		}



		.modals-cancel {
			position: absolute;
			z-index: 1000;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background-color: rgba(0, 0, 0, 0.5);
		}

		.bottom-dialog-body {
			position: absolute;
			z-index: 10001;
			bottom: 95px;
			left: 0;
			right: 0;
			height: 500rpx;
			background-color: #fff;
		}

		.bottom-dialog-box {
			position: absolute;
			z-index: 10001;
			bottom: 200rpx;
			left: 0;
			right: 0;
			height: 500rpx;
			background-color: #fff;
		}

		.radius {
			border-radius: 20rpx 20rpx 0 0;
		}

		.select-distribution {
			z-index: 100;
		}

		.select-distribution .bottom-dialog-box {
			position: absolute;
			z-index: 10001;
			left: 0;
			right: 0;
			bottom: 50px;
			height: 65%;
			background-color: #fff;
			overflow: auto;
		}

		/*动画前初始位置*/

		.bottom-pos {
			-webkit-transform: translateY(100%);
			transform: translateY(100%);
		}

		.discount-title {
			font-size: 30rpx;
			margin-bottom: 20rpx;
			padding: 26rpx;
			background: #f1f1f1;
			text-align: center;
			position: relative;
		}

		.radio-group {
			display: block;
			width: 100%;
			height: 350rpx;
			overflow-y: auto;
			padding: 0 20rpx;
			box-sizing: border-box;
		}

		.radio-item {
			display: flex;
			width: 100%;
			margin-bottom: 20rpx;
		}

		.radio-item .radio-text {
			font-size: 28rpx;
			word-break: break-all;
			max-width: 100%;
		}

		radio {
			transform: scale(1);
		}

		radio .wx-radio-input {
			text-align: left;
		}

		.discount-radio label {
			display: inline-block;
			height: 60rpx;
			line-height: 60rpx;
		}

		.discount-radio {
			font-size: 28rpx;
			height: 60rpx;
			line-height: 60rpx;
			padding: 0 20rpx
		}

		/* 购物车为空 */
		.empty {
			margin-top: 100rpx;
			text-align: cneter;
		}

		.empty-icon {
			display: block;
			width: 600rpx;
			height: 600rpx;
			margin: 0 auto;
			margin-bottom: 20rpx;
		}

		.empty-icon>image {
			width: 100%;
			height: 100%;
		}

		.empty-text {
			font-size: 28rpx;
			text-align: center;
			color: #999;
			line-height: 2em;
		}

		/* 金额明细 */
		.price-detail {
			max-height: 220rpx;
			overflow-y: scroll;
			padding: 10rpx 20rpx;
		}

		.price-detail-item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 3em;
			font-size: 28rpx;
			border-bottom: 1px solid #f2f2f2;
		}

		.price-detail-item:last-child {
			border: 0;
		}

		.det-num {
			color: #e43130;
		}

		/* 商品配送方式选择 */
		.distribution-prods {
			padding: 0 30rpx 30rpx;
			background: #fff;
		}

		.distribution-prods .des {
			color: #999;
			font-size: 24rpx;
			margin-top: 30rpx;
		}

		.distribution-prods .p-item {
			margin-top: 30rpx;
			background: #f9f9f9;
			border-radius: 10rpx;
			padding: 30rpx;
		}

		.distribution-prods .p-item .p-tit {
			font-size: 28rpx;
			font-weight: 600;
		}

		.distribution-prods .p-item .p-con {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin: 20rpx 0;
		}

		.distribution-prods .p-item .p-con .prods-item {
			max-width: 480rpx;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 1;
			overflow: hidden;
			text-overflow: ellipsis;
			font-size: 28rpx;
		}

		.distribution-prods .p-item .p-con .prods-item .pic {
			position: relative;
			width: 80rpx;
			height: 80rpx;
			/* font-size: 0; */
			margin-right: 20rpx;
			display: inline-block;
		}

		.distribution-prods .p-item .p-con .prods-item .pic .prod-count {
			position: absolute;
			bottom: 0;
			right: 0;
			font-size: 20rpx;
			padding: 0 10rpx;
			height: 30rpx;
			line-height: 30rpx;
			text-align: center;
			background: rgba(0, 0, 0, .3);
			border-radius: 12rpx 0 12rpx 0;
			color: #fff;
		}

		.distribution-prods .p-item .p-con .prods-item .pic image {
			width: 100%;
			height: 100%;
		}

		.distribution-prods .p-item .p-con .p-btn {
			background: #e43130;
			padding: 8rpx 30rpx;
			color: #fff;
			font-size: 24rpx;
			border-radius: 40rpx;
		}

		.distribution-prods .p-item .p-total {
			display: flex;
			align-items: baseline;
			font-size: 24rpx;
		}

		.distribution-prods .p-item .p-total .num {
			color: #e43130;
			font-family: arial;
			margin: 0 8rpx;
		}


		/* #ifdef APP-PLUS || MP-WEIXIN */
		.select-distribution .bottom-dialog-box {
			bottom: 0;
		}

		.pri-modal .bottom-dialog-box {
			bottom: 90rpx;
		}

		.bottom-dialog-body {
			bottom: 0;
		}

		/* #endif */
	}
</style>
